<wicket:head>
    <style type="text/css">
        .header div {
            border: thin solid;
            display: inline-block;
            float: left;
            height: 17em;
            width: 33%;
        }

        .header a {
            display: inline-block;
            height: 17em;
            width: 100%;
        }
    </style>
</wicket:head>
<wicket:extend>


    <div align="center">
        <a wicket:id="scanLink" href="#" data-role="button" data-inline="true" data-mini="true" align="center">
            <span class="scanButton"></span>
        </a>
        <a wicket:id="checkoutLink" data-role="button" data-inline="true" data-mini="true" align="center"><span
                class="checkoutButton"></span>
        </a>
    </div>
    <div id="selectCartLabel" style="text-align: center;">Please select a shopping cart by scanning the Barcode</div>

    <div wicket:id="productContainer" style="direction: rtl;">

        <ul id="productListView" data-role="listview">
            <li wicket:id="productListView">
                <span wicket:id="units"></span>
                <span>-</span>
                <span wicket:id="product.productName"></span>
                <span wicket:id="totalOrderPrice"></span>
                <span>ש"ח</span>

                <div data-role="controlgroup" data-type="horizontal" data-mini="true">
                    <a href="#" wicket:id="decreaseUnits" data-role="button" data-inline="true" data-icon="arrow-d"
                       data-mini="true">Down</a>
                    <a href="#" data-role="button" wicket:id="increaseUnits" data-inline="true" data-icon="arrow-u"
                       data-mini="true">Up</a>
                    <a href="#" data-role="button" wicket:id="removeProduct" data-inline="true" data-icon="delete"
                       data-mini="true">
                        Remove</a>
                </div>

            </li>
        </ul>
    </div>

    <ul data-role="listview">
        <li>
            <span>Welcome:</span>
            <span wicket:id="user.firstNameAndLastName"></span>
        </li>
        <li>
            <label>Weight:</label>
            <span wicket:id="totalWeightKg"></span> Kg
        </li>
        <li>
            <label><span>Units</span></label>
            <label wicket:id="totalProducts"></label>
        </li>
        <li>
            <label>Price:</label>
            <label wicket:id="totalPrice"></label> NIS
        </li>
    </ul>

</wicket:extend>
